<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  
</body>
</html>
<!-- <script src="./lib/Promise_Class.js"></script> -->
<script>

  /* 
  
  异步队列：
    宏队列：DOM事件回调 ajax 定时器
    微队列：promise mutation

  1. JS 中用来存储待执行回调函数的队列包含 2 个不同特定的列队
  2. 宏列队: 用来保存待执行的宏任务(回调), 比如: 定时器回调/DOM 事件回调 / ajax 回调
  3. 微列队: 用来保存待执行的微任务(回调), 比如: promise 的回调 / MutationObserver 的回调
  4. JS 执行时会区别这 2 个队列
    (1) JS 引擎首先必须先执行所有的初始化同步任务代码
    (2) 每次准备取出第一个宏任务执行前, 都要将所有的微任务一个一个取出来执行
  
  */

  // 会立即放入宏队列
  setTimeout(() => {
    console.log('timeout1 callback')
    Promise.resolve(3).then(value => {
      console.log('Promise3 onResolved()', value)
    })
  }, 0 )
  setTimeout(() => {
    console.log('timeout2 callback')
  }, 0)
  // 会立即放入微队列
  Promise.resolve(1).then(value => {
    console.log('Promise1 onResolved()', value)
  })
  Promise.resolve(2).then(value => {
    console.log('Promise2 onResolved()', value)
  })

</script>